<!DOCTYPE html>
<!--[if lt IE 9 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
    <head>
        <% if (htmlWebpackPlugin.options.gtm_id) { %>
        <!-- Google Tag Manager -->
        <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
            new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
            j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
            'https://www.googletagmanager.com/gtm.js?id='+i+dl+'<%= htmlWebpackPlugin.options.gtm_env_auth %>';
            f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','<%- htmlWebpackPlugin.options.gtm_id %>');
        </script>
        <!-- End Google Tag Manager -->
        <% } %>

        <meta charset="UTF-8" />

        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta name="viewport" content="width=<%= htmlWebpackPlugin.options.viewportWidth %>, initial-scale=1">

        <!-- Prevent mobile Safari from making phone numbers -->
        <meta name="format-detection" content="telephone=no">

        <% if (!htmlWebpackPlugin.options.dynamicMetaTags) { %>
            <title>Scratch - <%= htmlWebpackPlugin.options.title %></title>

            <!-- Search & Open Graph-->
            <meta name="description" content="<%= htmlWebpackPlugin.options.description %>" />
            <meta name="google-site-verification" content="m_3TAXDreGTFyoYnEmU9mcKB4Xtw5mw6yRkuJtXRKxM" />

            <meta property="og:url" content="https://scratch.mit.edu/" />
            <meta property="og:type" content="website" />
            <meta property="og:title" content="Scratch - <%= htmlWebpackPlugin.options.title %>" />
            <meta property="og:description" content="<%= htmlWebpackPlugin.options.description %>" />
            <meta property="og:image" content="<%- htmlWebpackPlugin.options.og_image %>" />
            <meta property="og:image:type" content="<%- htmlWebpackPlugin.options.og_image_type %>" />
            <meta property="og:image:width" content="<%- htmlWebpackPlugin.options.og_image_width %>" />
            <meta property="og:image:height" content="<%- htmlWebpackPlugin.options.og_image_height %>" />
        <% } %>

        <!-- Favicon & CSS normalize -->
        <link rel="shortcut icon" href="/favicon.ico" />
        <link rel="stylesheet" href="/css/lib/normalize.min.css" />
        <link rel="stylesheet" href="<%= htmlWebpackPlugin.files.chunks.common.css[0] %>" />
        <link rel="stylesheet" href="<%= htmlWebpackPlugin.files.chunks[htmlWebpackPlugin.options.route.name].css[0] %>" />

        <!-- Polyfills -->
        <script src="/js/polyfill.min.js"></script>
    </head>

    <body>
        <% if (htmlWebpackPlugin.options.gtm_id) { %>
        <!-- Google Tag Manager (noscript) -->
        <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=<%- htmlWebpackPlugin.options.gtm_id %><%= htmlWebpackPlugin.options.gtm_env_auth %>" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
        <!-- End Google Tag Manager (noscript) -->
        <% } %>
        <noscript>
            <p>Your browser has Javascript disabled. Please go to your browser preferences and enable Javascript in order to use Scratch.</p>
        </noscript>
        <div id="app"></div>

        <!-- Vendor & Initialize (Session & Localization)-->
        <script src="<%= htmlWebpackPlugin.files.chunks.common.entry %>"></script>

        <!-- Scripts -->
        <script src="/js/<%= htmlWebpackPlugin.options.route.intlName || htmlWebpackPlugin.options.route.name %>.intl.js"></script>
        <script src="<%= htmlWebpackPlugin.files.chunks[htmlWebpackPlugin.options.route.name].entry %>"></script>

        <!-- Translate title element -->
        <% if (!htmlWebpackPlugin.options.dynamicMetaTags) { %>
            <script>
                var loc = window._locale || 'en';
                if (typeof window._messages !== 'undefined' && loc !== 'en') {
                    if (typeof window._messages[loc] === 'undefined') {
                        loc = loc.split('-')[0];
                    }
                    if (typeof window._messages[loc] !== 'undefined') {
                        var localizedTitle = window._messages[loc]['general.' + '<%= htmlWebpackPlugin.options.title %>'.toLowerCase()] || '';
                        if (localizedTitle.length > 0) {
                            document.title = 'Scratch - ' + localizedTitle;
                        }
                    }
                }
            </script>
        <% } %>
    </body>
</html>
